var sign;
var signSubmitNum = 0;

/**
 * TODO:敏捷开发折中方案
 * *取消所有编辑表单的隐藏
 * *隐藏每一个区域的取消和完成按钮
 * 
 **/

$('.edit-info').css('display', 'block')
$('.form-btns').css('display', 'none')
$('.info-box').eq(3).css('display', 'none')
$('.info-box').eq(4).css('display', 'none')
$('.base-info').css('display', 'none')
$('.edit-btn').css('display', 'none')
$('.right-control').css('display', 'none')
$('.left-info p').css('display', 'none')

// 单选框切换
$("input[type='radio']").click(function () {
  $(this).parent('span').addClass("active").siblings().removeClass("active")
})

/**
 *!@Description: 监听鼠标点击事件 切换编辑和查看状态
 * **/

$('.view').click(function () {
  this.innerText == "预览简历" ? this.innerText = "编辑简历" : this.innerText = "预览简历"
  $('.edit-info').toggleClass('fobideen')
  $('input,select,textarea').toggleClass('fromactive')
  $('#submit').toggleClass('submitbtn')
})

/**
 *!@Description: 监听键盘shift按键按下事件 
 * **/
$(document).keyup(function (event) {
  if (event.keyCode === 16) {
    $('.view')[0].innerText == "预览简历" ? $('.view')[0].innerText = "编辑简历" : $('.view')[0].innerText = "预览简历"
    $('.edit-info').toggleClass('fobideen')
    $('input,select,textarea').toggleClass('fromactive')
    $('#submit').toggleClass('submitbtn')
  }
  // if (event.keyCode === 17) {
  //   location.replace("http://www.xiaohui.ac.cn",1000)
  // }
})
let textbox = document.querySelector('.view')
console.log(textbox);
textbox.addEventListener('keyup', (event) => {
  console.log(event.keyCode);
})
/**
 *!@Description: 监听键盘ctrl按键提交表单 
 * **/
// $(document).keyup(function (event) {

// })




$().ready(function () {
  // 在键盘按下并释放及提交后验证提交表单
  $("#signupForm").validate({
    success: "valid",
    submitHandler: function () {
      $('body').animatescroll();
      $('.edit-info').toggleClass('fobideen')
      $('input,select,textarea').toggleClass('fromactive')
      $('#submit').toggleClass('submitbtn')
      $('.view')[0].innerText = "编辑简历"
      var notyf = new Notyf({
        duration: 1000,
        position: {
          x: 'right',
          y: 'top',
        },
        types: [{
          type: 'warning',
          background: 'orange'
        }]
      });
      notyf.confirm('请检查您的简历是否有错误');

      $(document).keyup(function (event) {
        if (event.keyCode === 17) {
          location.replace("http://www.xiaohui.ac.cn", 1000)
        }
      })
    }
  })
});



// 编辑按钮点击事件
$(".edit-btn").click(function () {
  return
  /**
   * TODO:
   * *在点击编辑按钮后要获取到data-tag的值
   * *在获取edit-info时获取到的是一个数组，我们根据data-tag的值控制edit-info[data-tag]的样式的display
   * *attr只会获取到匹配到的第一个值
   * **/
  sign = this.getAttribute("data-tag");
  $(".edit-info").eq(sign).css("display", "block");
});

// 表单编辑部分按钮点击事件
$(".edit-info button").click(function () {
  /**
   * TODO:
   * *区分是取消事件还是确定事件，如果是确定事件要进行表单验证
   * *取消事件则目前什么也不做
   * **/
  if (this.innerText == '完成') {
    return
  }
  $(".edit-info").eq(sign).css("display", "none");
});

// 表单添加按钮点击事件
$(".left-info>p").click(function (e) {
  return
  // !通过children获取到的是一个DOM节点数组，而不是对象
  sign = this.nextElementSibling.children[1].children[0].getAttribute(
    "data-tag",
  );
  $(".edit-info").eq(sign).css("display", "block");
});

// 阻止除了提交按钮的其他按钮默认事件
// $('button:not("#submit")').click(() => {
//   return false
// })

// 添加表单input的聚焦事件和失去焦点事件
/**
 * TODO:
 * *如何精确获取对应input的的聚焦事件
 * *获取到该input的唯一标识，也就是id
 * *jQuery中不要用箭头函数！
 * 
 * **/
$('input').focus(function () {
  $(this).css('box-shadow', '0 0 4px #53cac3')
})
$('input').blur(function () {
  $(this).css('box-shadow', 'none')
})